<template>
	<view class="content">
		<map style="width: 100%; height: 90vh;" :latitude="latitude" :longitude="longitude" :markers="markers"
			@markertap="onMarkerTap" :scale="scale"></map>
	</view>
</template>

<script>
export default {
	data() {
		return {
			latitude: 23.185280, // 默认纬度（如广州塔）
			longitude: 112.872778, // 默认经度
			scale: 14,
			map_markers: [{
				id: 1,
				latitude: 23.185280,
				longitude: 112.872778,
				callout: {
					content: '天宝大厦', // 气泡内容
					bgColor: '#e51860',
					display: 'ALWAYS', // 常显
					padding: 4
				}
			}]
		};
	},
	computed: {
		markers() {
			return this.map_markers
		}
	},
	onLoad(e) {
		// 地图
	},
	methods: {
		onMarkerTap(e) {
			uni.openLocation({
				latitude: Number(23.185280),
				longitude: Number(112.872778),
				name: "天宝大厦",
				address: "广州市天河区黄埔大道西601号",
				success: function (res) { console.log('打开系统位置地图成功') },
				fail: function (error) { console.log(error) },
			})
			console.log('点击标记点:', e.markerId); // 获取标记点ID
		}
	}
}
</script>

<style>
page {
	background-color: #F8F8F8;
}
</style>

<style lang="scss">
/deep/ .uni-navbar {
	width: 100%;
	position: fixed;
	left: 0;
	top: 0;
	z-index: 999;
}

/deep/.u-subsection--button__bar {
	background: linear-gradient(180deg, #FF561D 33%, #FF0064 100%) !important;
	color: #FFF !important;
}

.wrap {
	font-size: 0;
}

.doorHead {
	width: 750rpx;
	height: 750rpx;
}

.logo {
	width: 96rpx;
	height: 96rpx;
}

.collection-box {
	width: 146rpx;
	height: 56rpx;
	border-radius: 78rpx;
	border: 2rpx solid #FFF;
}

.share-btn-wrap {
	width: 40rpx;
	height: 40rpx;
	position: relative;

	.share-btn {
		width: 40rpx;
		height: 40rpx;
		border: none;
		border-color: transparent;
		background: none !important;
		position: absolute;
		left: 0;
		top: 0;
		z-index: 1;

		&:after {
			border: none;
			background: none !important;
		}
	}
}

.cart-img {
	width: 112rpx;
	height: 112rpx;
	position: fixed;
	right: 20rpx;
	bottom: 160rpx;
}
</style>